@import '../../../styles/base.less';

.local-meida-modal {
  position: relative;

  :global {
    .ant-modal-body {
      padding: 0;
    }
  }
}

.local-meida-modal__content {
  height: 400px;
  padding: 15px 24px;
  overflow: auto;
}

.local-meida-modal__list {
  padding: 0;
  margin: 0;
  list-style: none;
}

.local-meida-modal__file {
  display: flex;
  align-items: center;
  height: 64px;
}

.local-meida-modal__file__icon {
  flex: none;
  font-size: 40px;
  color: @primary-color;
}

.local-meida-modal__file__name {
  .text-overflow();
  width: 390px;
  flex-grow: 1;
  padding: 16px;
}

.local-meida-modal__file__actions {
  :global {
    .ant-btn + .ant-btn {
      margin-left: 8px;
    }
  }
}

.local-meida-modal__footer {
  display: flex;
  padding: 15px 24px;
  border-top: 1px solid @divider-color;
}

.local-meida-modal__footer__tip {
  display: flex;
  align-items: center;
  color: @primary-color;

  svg {
    margin-right: 4px;
    font-size: 18px;
  }
}

.local-meida-modal__footer__popover {
  padding: 0;
  margin: 0;
  list-style: none;
}

.local-meida-modal__footer__actions {
  flex-grow: 1;
  display: flex;
  flex-direction: row-reverse;
}

.local-meida-modal__footer__playall {
  margin-right: 8px;

  svg {
    margin-right: 4px;
    font-size: 16px;
    vertical-align: text-bottom;
  }
}
